<!DOCTYPE html>

<html class="no-js">

<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <title></title>
  <meta name="description" content="" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <script src="https://cdn.staticfile.org/axios/0.19.0-beta.1/axios.js"></script>
  <script src="../../cdn/vue/vue.global.min.js"></script>
  <link rel="stylesheet" href="../../cdn/element-plus/index.css" />
  <script src="../../cdn/element-plus/index.full.min.js"></script>

  <link rel="stylesheet" href="../../../lib/index.css" />
  <script src="../../../lib/avue.js"></script>
</head>

<body>
  <div id="app">
    <avue-crud :option="option" :data="data">
      <template #shenfengSearch="{}">
        <avue-input type="tree" :dic="dic" :props="props"></avue-input>
      </template>
    </avue-crud>
  </div>
</body>
<script>
  const baseUrl = 'https://cli.avuejs.com/api/area'
  const dic = [{
    "id": 6,
    "name": "系统配制",
    "permissionkey": "/system",
    "type": "MENU",
    "enable": true,
    "descnote": "系统配制",
    "wiegth": 0,
    "path": "/system",
    "resource": null,
    "component": "",
    "icon": "icon-caidan",
    "children": [{
      "id": 4,
      "name": "角色管理",
      "permissionkey": "/system/role",
      "type": "MENU",
      "enable": true,
      "descnote": "角色管理",
      "wiegth": 10,
      "path": "/system/role",
      "resource": "/system/role/list",
      "component": "views/system/role",
      "icon": "icon-caidan",
      "children": [{
        "id": 32,
        "name": "删除角色",
        "permissionkey": "system:role:delete",
        "type": "FUNCTION",
        "enable": true,
        "descnote": "删除角色",
        disabled: true,
        "wiegth": 0,
        "path": "",
        "resource": "/system/role/delete",
        "component": null,
        "icon": null,
        "children": [],
        "meta": null,
        "text": "删除角色",
        "label": "删除角色"
      }],
      "meta": "{i18n:\"role\"}",
      "text": "角色管理",
      "label": "角色管理"
    }, {
      "id": 19,
      "name": "权限资源",
      "permissionkey": "/system/permission",
      "type": "MENU",
      "enable": true,
      "descnote": "权限资源",
      "wiegth": 0,
      "path": "/system/permission",
      "resource": "/system/permission/list",
      "component": "views/system/permission",
      "icon": "icon-caidan",
      "children": [],
      "meta": "{i18n:\"permission\"}",
      "text": "权限资源",
      "label": "权限资源",
      "children": [{
        "id": 232,
        "name": "删除角色",
        "permissionkey": "system:role:delete",
        "type": "FUNCTION",
        "enable": true,
        "descnote": "删除角色",
        "wiegth": 0,
        "path": "",
        "resource": "/system/role/delete",
        "component": null,
        "icon": null,
        "children": [],
        "meta": null,
        "text": "删除角色",
        "label": "删除角色"
      }],
    }],
    "meta": "{i18n:\"systemconfig\"}",
    "text": "系统配制",
    "label": "系统配制"
  }, {
    "id": 8,
    "name": "sys_crud_btn_add",
    "permissionkey": "sys_crud_btn_add",
    "type": "FUNCTION",
    "enable": true,
    "descnote": null,
    "wiegth": 0,
    "path": null,
    "resource": null,
    "component": null,
    "icon": null,
    "children": [],
    "meta": null,
    "text": "sys_crud_btn_add",
    "label": "sys_crud_btn_add"
  }, {
    "id": 9,
    "name": "sys_crud_btn_export",
    "permissionkey": "sys_crud_btn_export",
    "type": "FUNCTION",
    "enable": true,
    "descnote": null,
    "wiegth": 0,
    "path": null,
    "resource": null,
    "component": null,
    "icon": null,
    "children": [],
    "meta": null,
    "text": "sys_crud_btn_export",
    "label": "sys_crud_btn_export"
  }, {
    "id": 10,
    "name": "sys_menu_btn_add",
    "permissionkey": "sys_menu_btn_add",
    "type": "FUNCTION",
    "enable": true,
    "descnote": null,
    "wiegth": 0,
    "path": null,
    "resource": null,
    "component": null,
    "icon": null,
    "children": [],
    "meta": null,
    "text": "sys_menu_btn_add",
    "label": "sys_menu_btn_add"
  }, {
    "id": 11,
    "name": "sys_menu_btn_edit",
    "permissionkey": "sys_menu_btn_edit",
    "type": "FUNCTION",
    "enable": true,
    "descnote": null,
    "wiegth": 0,
    "path": null,
    "resource": null,
    "component": null,
    "icon": null,
    "children": [],
    "meta": null,
    "text": "sys_menu_btn_edit",
    "label": "sys_menu_btn_edit"
  }, {
    "id": 12,
    "name": "sys_menu_btn_del",
    "permissionkey": "sys_menu_btn_del",
    "type": "FUNCTION",
    "enable": true,
    "descnote": null,
    "wiegth": 0,
    "path": null,
    "resource": null,
    "component": null,
    "icon": null,
    "children": [],
    "meta": null,
    "text": "sys_menu_btn_del",
    "label": "sys_menu_btn_del"
  }, {
    "id": 13,
    "name": "sys_role_btn1",
    "permissionkey": "sys_role_btn1",
    "type": "FUNCTION",
    "enable": true,
    "descnote": null,
    "wiegth": 0,
    "path": null,
    "resource": null,
    "component": null,
    "icon": null,
    "children": [],
    "meta": null,
    "text": "sys_role_btn1",
    "label": "sys_role_btn1"
  }, {
    "id": 14,
    "name": "sys_role_btn2",
    "permissionkey": "sys_role_btn2",
    "type": "FUNCTION",
    "enable": true,
    "descnote": null,
    "wiegth": 0,
    "path": null,
    "resource": null,
    "component": null,
    "icon": null,
    "children": [],
    "meta": null,
    "text": "sys_role_btn2",
    "label": "sys_role_btn2"
  }, {
    "id": 15,
    "name": "sys_role_btn3",
    "permissionkey": "sys_role_btn3",
    "type": "FUNCTION",
    "enable": true,
    "descnote": null,
    "wiegth": 0,
    "path": null,
    "resource": null,
    "component": null,
    "icon": null,
    "children": [],
    "meta": null,
    "text": "sys_role_btn3",
    "label": "sys_role_btn3"
  }, {
    "id": 16,
    "name": "sys_role_btn4",
    "permissionkey": "sys_role_btn4",
    "type": "FUNCTION",
    "enable": true,
    "descnote": null,
    "wiegth": 0,
    "path": null,
    "resource": null,
    "component": null,
    "icon": null,
    "children": [],
    "meta": null,
    "text": "sys_role_btn4",
    "label": "sys_role_btn4"
  }, {
    "id": 17,
    "name": "sys_role_btn5",
    "permissionkey": "sys_role_btn5",
    "type": "FUNCTION",
    "enable": true,
    "descnote": null,
    "wiegth": 0,
    "path": null,
    "resource": null,
    "component": null,
    "icon": null,
    "children": [],
    "meta": null,
    "text": "sys_role_btn5",
    "label": "sys_role_btn5"
  }, {
    "id": 18,
    "name": "sys_role_btn6",
    "permissionkey": "sys_role_btn6",
    "type": "FUNCTION",
    "enable": true,
    "descnote": null,
    "wiegth": 0,
    "path": null,
    "resource": null,
    "component": null,
    "icon": null,
    "children": [],
    "meta": "{i18n:\"dashboard\"}",
    "text": "sys_role_btn6",
    "label": "sys_role_btn6"
  }, {
    "id": 31,
    "name": "test",
    "permissionkey": "/test",
    "type": "MENU",
    "enable": true,
    "descnote": null,
    "wiegth": 0,
    "path": "/test",
    "resource": null,
    "component": null,
    "icon": null,
    "children": [{
      "id": 1,
      "name": "异常页",
      "permissionkey": "/error",
      "type": "MENU",
      "enable": true,
      "descnote": "测试",
      "wiegth": 0,
      "path": "/error",
      "resource": "",
      "component": null,
      "icon": "icon-caidan",
      "children": [{
        "id": 2,
        "name": "403",
        "permissionkey": "/error/error",
        "type": "MENU",
        "enable": true,
        "descnote": null,
        "wiegth": 0,
        "path": "/error/403",
        "resource": "",
        "component": "components/error-page/403",
        "icon": "icon-caidan",
        "children": [],
        "meta": null,
        "text": "403",
        "label": "403"
      }, {
        "id": 3,
        "name": "404",
        "permissionkey": "/error/404",
        "type": "MENU",
        "enable": true,
        "descnote": null,
        "wiegth": 2,
        "path": "/error/404",
        "resource": null,
        "component": "components/error-page/404",
        "icon": "icon-caidan",
        "children": [],
        "meta": null,
        "text": "404",
        "label": "404"
      }, {
        "id": 5,
        "name": "500",
        "permissionkey": "/error/500",
        "type": "MENU",
        "enable": true,
        "descnote": null,
        "wiegth": 1,
        "path": "/error/500",
        "resource": null,
        "component": "components/error-page/500",
        "icon": "icon-caidan",
        "children": [],
        "meta": null,
        "text": "500",
        "label": "500"
      }],
      "meta": "{i18n:\"error\"}",
      "text": "异常页",
      "label": "异常页"
    }, {
      "id": 7,
      "name": "缓冲",
      "permissionkey": "/cache",
      "type": "MENU",
      "enable": true,
      "descnote": null,
      "wiegth": 0,
      "path": "/test/cache",
      "resource": null,
      "component": "views/util/cache",
      "icon": "icon-caidan",
      "children": [],
      "meta": "{i18n:\"cache\"}",
      "text": "缓冲",
      "label": "缓冲"
    }, {
      "id": 20,
      "name": "标签",
      "permissionkey": "/tags",
      "type": "MENU",
      "enable": true,
      "descnote": null,
      "wiegth": 0,
      "path": "/test/tags",
      "resource": null,
      "component": "views/util/tags",
      "icon": "icon-caidan",
      "children": [],
      "meta": "{i18n:\"tags\"}",
      "text": "标签",
      "label": "标签"
    }, {
      "id": 21,
      "name": "存储",
      "permissionkey": "/store",
      "type": "MENU",
      "enable": true,
      "descnote": "存储",
      "wiegth": 0,
      "path": "/test/store",
      "resource": null,
      "component": "views/util/store",
      "icon": "icon-caidan",
      "children": [],
      "meta": "{i18n:\"store\"}",
      "text": "存储",
      "label": "存储"
    }, {
      "id": 22,
      "name": "全局函数",
      "permissionkey": "avuex",
      "type": "MENU",
      "enable": true,
      "descnote": "全局函数",
      "wiegth": 0,
      "path": "https://avuex.avue.top/$/doc/api",
      "resource": null,
      "component": null,
      "icon": "icon-caidan",
      "children": [],
      "meta": "{i18n:\"api\"}",
      "text": "全局函数",
      "label": "全局函数"
    }, {
      "id": 23,
      "name": "日志监控",
      "permissionkey": "/logs",
      "type": "MENU",
      "enable": true,
      "descnote": "日志监控",
      "wiegth": 0,
      "path": "/test/logs",
      "resource": null,
      "component": "views/util/logs",
      "icon": "icon-caidan",
      "children": [],
      "meta": "{i18n:\"logs\"}",
      "text": "日志监控",
      "label": "日志监控"
    }, {
      "id": 24,
      "name": "表格",
      "permissionkey": "/table",
      "type": "MENU",
      "enable": true,
      "descnote": "表格",
      "wiegth": 0,
      "path": "/test/table",
      "resource": null,
      "component": "views/util/table",
      "icon": "icon-caidan",
      "children": [],
      "meta": "{i18n:\"table\"}",
      "text": "表格",
      "label": "表格"
    }, {
      "id": 25,
      "name": "表单",
      "permissionkey": "/form",
      "type": "MENU",
      "enable": true,
      "descnote": "表单",
      "wiegth": 0,
      "path": "/test/form",
      "resource": null,
      "component": "views/util/form",
      "icon": "icon-caidan",
      "children": [],
      "meta": "{i18n:\"form\"}",
      "text": "表单",
      "label": "表单"
    }, {
      "id": 26,
      "name": "权限",
      "permissionkey": "/permission",
      "type": "MENU",
      "enable": true,
      "descnote": "权限",
      "wiegth": 0,
      "path": "/test/permission",
      "resource": null,
      "component": "views/util/permission",
      "icon": "icon-caidan",
      "children": [],
      "meta": "{i18n:\"permission\"}",
      "text": "权限",
      "label": "权限"
    }, {
      "id": 27,
      "name": "返回顶部",
      "permissionkey": "/top",
      "type": "MENU",
      "enable": true,
      "descnote": "返回顶部",
      "wiegth": 0,
      "path": "/test/top",
      "resource": null,
      "component": "views/util/top",
      "icon": "icon-caidan",
      "children": [],
      "meta": "{i18n:\"top\"}",
      "text": "返回顶部",
      "label": "返回顶部"
    }, {
      "id": 28,
      "name": "表格表单",
      "permissionkey": "/crud-form",
      "type": "MENU",
      "enable": true,
      "descnote": "表格表单",
      "wiegth": 0,
      "path": "/test/crud-form",
      "resource": null,
      "component": "views/util/crud-form",
      "icon": "icon-caidan",
      "children": [],
      "meta": "{i18n:\"crudForm\"}",
      "text": "表格表单",
      "label": "表格表单"
    }, {
      "id": 29,
      "name": "图钉",
      "permissionkey": "/affix",
      "type": "MENU",
      "enable": true,
      "descnote": "图钉",
      "wiegth": 0,
      "path": "/test/affix",
      "resource": null,
      "component": "views/util/affix",
      "icon": "icon-caidan",
      "children": [],
      "meta": "{i18n:\"affix\"}",
      "text": "图钉",
      "label": "图钉"
    }, {
      "id": 30,
      "name": "数据展示",
      "permissionkey": "/data",
      "type": "MENU",
      "enable": true,
      "descnote": "数据展示",
      "wiegth": 0,
      "path": "/test/data",
      "resource": null,
      "component": "views/util/data",
      "icon": "icon-caidan",
      "children": [],
      "meta": "{i18n:\"data\"}",
      "text": "数据展示",
      "label": "数据展示"
    }],
    "meta": "{i18n:\"test\"}",
    "text": "test",
    "label": "test"
  }]
  const props = {
    label: 'name',
    value: 'id'
  }
  var app = Vue.createApp({
    data() {
      return {
        dic: dic,
        props: props,
        data: [{
          shenfeng1: 32
        }],
        option: {
          column: [{
            label: '多选',
            prop: 'shenfeng',
            type: 'tree',
            searchMmultiple: true,
            search: true,
            multiple: true,
            lazy: true,
            treeLoad: function (node, resolve) {
              if (node.level === 0) {
                return resolve([{ disabled: true, name: 'region', id: new Date().getTime() }]);
              }
              if (node.level > 2) return resolve([]);
              setTimeout(() => {
                const data = [{
                  name: 'leaf',
                  id: new Date().getTime(),
                  isend: true
                }, {
                  id: new Date().getTime(),
                  name: 'zone'
                }];

                resolve(data);
              }, 500);
            },
            props: {
              label: 'name',
              value: 'id',
              leaf: 'isend'
            },
            hide: false,
            rules: [{
              required: true,
              message: "请选择多选",
              trigger: "change"
            }],
            nodeClick: (data) => {
              this.$message.success(JSON.stringify(data))
            },
            checked: (data) => {
              this.$message.success(JSON.stringify(data))
            }
          }, {
            label: '单选',
            prop: 'shenfeng1',
            type: 'tree',
            dicData: dic,
            props: {
              label: 'name',
              value: 'id'
            },
            rules: [{
              required: true,
              message: "请选择单选",
              trigger: "change"
            }]
          }]
        }
      }
    },
    created() {

    },
    methods: {
      submit() {
        this.$message.success('当前数据' + JSON.stringify(this.form))
      }
    }
  })
  app.use(ElementPlus)
  app.use(AVUE)
  app.mount('#app')
</script>


</html>